<template>
<div class="documentMember-declaring-customsVue">
  <el-tabs v-model="tabValue" @tab-click="documentProcessChoose">
    <el-tab-pane label="货运委托书" name="1">
      <letterOfDeliveryVue :bus="bus"  :editable="editable" :data="data.documentprocess_cc_letterOfDelivery"></letterOfDeliveryVue>
    </el-tab-pane>
    <el-tab-pane label="报关发票" name="2">
      <customsDeclarationInvoiceVue :bus="bus"  :editable="editable" :relation="relation" :relatedData="data.documentprocess_cc_letterOfDelivery" :data="data.documentprocess_cc_customsDeclarationInvoice"></customsDeclarationInvoiceVue>
    </el-tab-pane>
    <el-tab-pane label="报关箱单" name="3">
      <customsDeclarationBoxVue :bus="bus"  :editable="editable" :relation="relation":relatedData="data.documentprocess_cc_letterOfDelivery" :data="data.documentprocess_cc_customsDeclarationBox"></customsDeclarationBoxVue>
    </el-tab-pane>
    <el-tab-pane label="报关合同&委托书" name="4">
      <customsDeclarationContractVue  :bus="bus"  :editable="editable" :relation="relation" :relatedData1="data.documentprocess_cc_customsDeclarationBox" :relatedData2="data.documentprocess_cc_customsDeclarationInvoice" :data="data.documentprocess_cc_customsDeclarationContract" ></customsDeclarationContractVue>
    </el-tab-pane>
    <el-tab-pane label="报关单" name="5">
      <declarationFormVue :bus="bus"  :editable="editable" :relation="relation" :relatedData1="data.documentprocess_cc_customsDeclarationBox"  :relatedData2="data.documentprocess_cc_customsDeclarationInvoice" :data="data.documentprocess_cc_declarationForm" ></declarationFormVue>
    </el-tab-pane>
    <el-tab-pane label="申报要素" name="6">
      <declarationElementsVue   :editable="editable" :data="data.documentprocess_cc_declarationElements"></declarationElementsVue>
    </el-tab-pane>
  </el-tabs>
</div>
</template>

<script>
import letterOfDeliveryVue from './components/letterOfDeliveryVue.vue'
import customsDeclarationInvoiceVue from './components/customsDeclarationInvoiceVue.vue'
import customsDeclarationBoxVue from './components/customsDeclarationBoxVue.vue'
import customsDeclarationContractVue from './components/customsDeclarationContractVue.vue'
import declarationFormVue from './components/declarationFormVue.vue'
import declarationElementsVue from './components/declarationElementsVue.vue'



export default {

  created(){
  },
  mounted(){

  },
  updated(){
  },
  components: {
    letterOfDeliveryVue,
    customsDeclarationInvoiceVue,
    customsDeclarationBoxVue,
    customsDeclarationContractVue,
    declarationFormVue,
    declarationElementsVue
  },
  data() {
    return {
      tabValue: '1',
      clickTimes: 0,
    }
  },
  props: {
    data: {
      type: Object,
      required: true
    },
    relation: {
      type: Boolean,
      required: true
    },
    editable: {
      type:Boolean,
      required: true
    },
    bus: {
      type: Object,
      required: true
    }
  },
  methods: {
    documentProcessChoose(current) {
      let component = current.$children[0];
      if (component.clickTimes == 0){
        component.$forceUpdate();
        component.clickTimes++;
      }
    }
  }
}
</script>

<style scoped lang="scss">
.documentMember-declaring-customsVue{
  box-sizing: border-box;

}
</style>
